<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>添加文章</title>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <link rel="stylesheet" href="../../css/oksub.css">
    </head>
    <body>
        <div class="ok-body">
            <!--面包屑导航区域-->
            <div class="ok-body-breadcrumb">
                <span class="layui-breadcrumb">
                    <a><cite>首页</cite></a>
                    <a><cite>常用页面</cite></a>
                    <a><cite>用户列表</cite></a>
                    <a><cite>添加文章</cite></a>
                </span>
                <a class="layui-btn layui-btn-sm" href="javascript:location.replace(location.href);" title="刷新">
                    <i class="layui-icon layui-icon-refresh"></i>
                </a>
            </div>
            <!--form表单-->
            <form class="layui-form layui-form-pane ok-form">
                <div class="layui-form-item">
                    <label class="layui-form-label">标题</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" placeholder="请输入文章标题" autocomplete="off" class="layui-input"
                               lay-verify="required">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">分类</label>
                    <div class="layui-input-block">
                        <select name="classify">
                            <option value="0">公告</option>
                            <option value="1">言情</option>
                            <option value="2">都市</option>
                            <option value="3">修仙</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">标签</label>
                    <div class="layui-input-block">
                        <input type="text" name="label" placeholder="请输入文章标签" autocomplete="off" class="layui-input" lay-verify="required">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">状态</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="status" lay-skin="switch" lay-text="启用|停用" checked value="0">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">置顶</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="isTop" lay-skin="switch" lay-text="是|否" value="0">
                    </div>
                </div>
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">内容</label>
                    <div class="layui-input-block">
                        <textarea name="content" placeholder="请输入文章内容" class="layui-textarea" lay-verify="required"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="add">立即提交</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        </div>
        <!--js逻辑-->
        <script src="../../lib/layui/layui.js"></script>
        <script>
            layui.use(['element', 'form', 'jquery', 'laydate'], function () {
                var element = layui.element;
                var table = layui.table;
                var form = layui.form;
                var $ = layui.jquery;
                var laydate = layui.laydate;

                laydate.render({
                    elem: '#birthday',
                    type: "datetime"
                });

                form.verify({
                    birthdayVerify: [/^((((1[6-9]|[2-9]\d)\d{2})-(0?[13578]|1[02])-(0?[1-9]|[12]\d|3[01]))|(((1[6-9]|[2-9]\d)\d{2})-(0?[13456789]|1[012])-(0?[1-9]|[12]\d|30))|(((1[6-9]|[2-9]\d)\d{2})-0?2-(0?[1-9]|1\d|2[0-8]))|(((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))-0?2-29-))(\s(([01]\d{1})|(2[0123])):([0-5]\d):([0-5]\d))?$/, '日期格式不正确']
                });

                form.on('submit(add)', function (data) {
                    console.log(data.field);
                    layer.msg("添加成功！", {icon: 6, time: 1000, anim: 4}, function () {
                        parent.layer.close(parent.layer.getFrameIndex(window.name));
                    });
                    return false;
                });
            })
        </script>
    </body>
</html>
